<template>
  <div>
    <router-link to="/UsRecord"><h1>直接查看我的浏览记录</h1></router-link>
    <table border="1">
      <tr>
        <th>教练名</th>
        <th>教练等级</th>
        <th>教练状态</th>
        <th>操作</th>
      </tr>
      <tr v-for="i in coach_list" :key="i.id">
        <th>{{i.name}}</th>
        <th>{{i.leven.name}}</th>
        <th>{{i.status.name}}</th>
        <th>
          <button v-if="i.status.id =='2'">不可选</button>
          <button @click="pick(i)" v-show="i.status.id=='1'">选择</button>
          <button @click="stop(i)">结束</button>
        </th>
      </tr>
    </table>
  </div>
</template>

<script>
  export default {
    name: "ShowCoach",
    data() {
      return {
        coach_list: [],
        uid: sessionStorage.getItem("id"),
        counter: sessionStorage.getItem("counter")

      }
    },
    methods: {
      pick(i) {
        this.axios.post("cart/", {"uid": this.uid, "coach": i.id})
          .then(resp => {
            // alert(resp.data.msg)
            console.log(resp.data)
          }).catch(err => {
          console.log(err)
        })
      },
      stop(i) {
        this.axios.put("cart/", {"uid": this.uid, "coach": i.id})
          .then(resp => {
            if (this.counter >= 3) {
            //   alert("本次以后给你打九折")
              console.log(resp.data)
              this.$router.push({
                name: "Member",
                query: {
                  "id": i.id
                }
              })
            } else {
                console.log(resp.data)
            this.$router.push({
              name: "Member",
              query: {
                "id": i.id
              }
            })
            }

          }).catch(err => {
          console.log(err)
        })

      },


    },
    created() {
      this.axios.get("coach/")
        .then(resp => {
          console.log(resp.data)
          this.coach_list = resp.data
        }).catch(err => {
        console.log(err)
      })

    }
  }
</script>

<style scoped>

</style>
